
<!DOCTYPE html>  
<html>  
<head>  
  <meta charset="UTF-8">  
  <title>跳转中</title>  
  <style>  
      .buffer{  
            background-color: black;  
            height: 100%;  
            width: 60%;  
            margin: 10em auto;  
            filter: alpha(Opacity=60);  
            -moz-opacity: 0.6;  
            opacity: 0.85;  
            border-radius: 7px;  
        }  
  
        .buffer_tip{  
          color: wheat;  
          font-size: 30px;  
          display: block;  
          padding-top: 10px;  
          text-align: center;  
        }  
        .spinner {  
          margin: 16px auto 57px;  
          width: 32px;  
          height: 32px;  
          position: relative;  
        }  
           
        .cube1, .cube2 {  
          background-color: #67CF22;  
          width: 30px;  
          height: 30px;  
          position: absolute;  
          top: 0;  
          left: 0;  
             
          -webkit-animation: cubemove 1.8s infinite ease-in-out;  
          animation: cubemove 1.8s infinite ease-in-out;  
        }  
           
        .cube2 {  
          -webkit-animation-delay: -0.9s;  
          animation-delay: -0.9s;  
        }  
           
        @-webkit-keyframes cubemove {  
          25% { -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5) }  
          50% { -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg) }  
          75% { -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5) }  
          100% { -webkit-transform: rotate(-360deg) }  
        }  
           
        @keyframes cubemove {  
          25% {  
            transform: translateX(42px) rotate(-90deg) scale(0.5);  
            -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);  
          } 50% {  
            transform: translateX(42px) translateY(42px) rotate(-179deg);  
            -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);  
          } 50.1% {  
            transform: translateX(42px) translateY(42px) rotate(-180deg);  
            -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);  
          } 75% {  
            transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);  
            -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);  
          } 100% {  
            transform: rotate(-360deg);  
            -webkit-transform: rotate(-360deg);  
          }  
        }  
  
        #href{  
                color: wheat;  
                font-size: 20px;  
        }  
        a:link{  
                text-decoration:none;  
        }  
  </style>  
</head>  
<body>  
  
<div class='buffer' id='buffer' >  
        <span class='buffer_tip' id='buffer_tip' >  
        <php>  
                if($code==1) {  
                        echo strip_tags($msg);  
                }else{  
                        if($code==0) {  
                                echo strip_tags($msg);  
                        }else{  
                                echo '操作出现错误';  
                        }   
                }  
        </php>  
        <a id="href" href="<?php echo($url); ?>">(<b id="wait"><?php echo($wait); ?></b>s)</a>  
        </span>  
        <div class="spinner">  
          <div class="cube1"></div>  
          <div class="cube2"></div>  
        </div>  
</div>  
  
<script type="text/javascript">  
(function(){  
var wait = document.getElementById('wait'),href = document.getElementById('href').href;  
var interval = setInterval(function(){  
        var time = --wait.innerHTML;  
        if(time <= 0) {  
                location.href = href;  
                clearInterval(interval);  
        };  
}, 1000);  
})();  
</script>  
</body>  
</html>  